<template>
  <div v-if="showUI">
    <el-descriptions title="单板属性" :column="1" :border="true" style="width: 800px">
      <template slot="extra">
        <el-button type="primary" size="small" @click="getEq">刷新</el-button>
      </template>
      <el-descriptions-item>
        <template slot="label">板卡名称</template>
        {{ computeName(info.eqs.eq.name) }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">所属机框</template>
        {{ nodeName }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">所属槽位</template>
        {{ computeSlot(info.eqs.eq.name) }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label">在位状态</template>
        <el-tag size="medium" :type="info.eqs.eq['plug-state']?'success':'danger'" effect="dark">
          {{ info.eqs.eq["plug-state"] ? '已在位' : '无板卡' }}
        </el-tag>
      </el-descriptions-item>

      <el-descriptions-item>
        <template slot="label"> 运行状态</template>
        {{ info.eqs.eq["eq-state"] }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> SN码</template>
        {{ info.eqs.eq["eq-sn"] }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 软件版本</template>
        {{ info.eqs.eq["software-version"] }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 硬件版本</template>
        {{ info.eqs.eq["hardware-version"] }}
      </el-descriptions-item>

      <el-descriptions-item>
        <template slot="label"> 包含PTP</template>
        <span v-for="(i,key) in info.eqs.eq.ptp" :key="key">
          <span>
            <router-link :to="{
              name:'PTP',
              params:{
                  name:i,
              }
            }">
            {{ "端口-"+computePort(i) }}
          </router-link>
             <el-divider direction="vertical" v-if="key!==info.eqs.eq.ptp.length-1"></el-divider>
          </span>
        </span>
      </el-descriptions-item>
    </el-descriptions>


  </div>
</template>

<script>
import axios from "axios";

export default {
  name: "Eq",
  data() {
    return {
      nodeName: '',
      eqName: '',
      showUI:false,
      info: {
        eqs: {
          eq: {
            name: "EQ=/shelf=1/slot=1/subslot=1/EQ=1",
            "plug-state": true,
            me: 'otna',
            slot: '1',
            "software-version": "v1.0.8  -2020/8/7 16:50:48",
            "hardware-version": "pcb_ver:1 board_type:none",
            'eq-type': 'Power',
            'eq-sn': 'cd12-322344',
            ptp: [
              "端口-1",
              "端口-2",
              "端口-3",
              "端口-4",
              "端口-5",
              "端口-6",
            ],
            "eq-state": "初始化中···"
          }
        }
      },
      info1: {
        eqs: {
          "eq": [
            {
              "name": "槽道-1 OTN2X8",
              "plug-state": true,
              me: 'otna',
              slot: '1',
              "software-version": "v1.0.8  -2020/8/7 16:50:48",
              "hardware-version": "pcb_ver:1 board_type:none",
              'eq-type': 'Power',
              'eq-sn': 'cd12-322344',
              "ptp": [
                "PTP=/shelf=1/slot=1/subslot=1/port=9",
                "PTP=/shelf=1/slot=1/subslot=1/port=8",
                "PTP=/shelf=1/slot=1/subslot=1/port=10",
                "PTP=/shelf=1/slot=1/subslot=1/port=7"
              ],
              "eq-state": "初始化中···"
            },

          ]
        },
      }
    }
  },
  methods: {

    computeName(name) {
      let sub = "/EQ=";
      for (let i = 0; i <= (name.length - sub.length); i++) {
        if (name.substring(i, i + sub.length) === sub) {
          return name.substring(i + sub.length);
        }
      }
    },
    computeSlot(name) {
      let sub = "/slot=";
      for (let i = 0; i <= (name.length - sub.length); i++) {
        if (name.substring(i, i + sub.length) === sub) {
          let slot = name.substring(i + sub.length, name.length);
          return slot.substring(0, slot.indexOf("/"));
        }
      }
    },
    computePort(name) {
      let sub = "/port=";
      for (let i = 0; i <= (name.length - sub.length); i++) {
        if (name.substring(i, i + sub.length) === sub) {
          return name.substring(i + sub.length, name.length);
        }
      }
    },
    async getEq() {
      this.nodeName = this.$route.params.node;
      this.eqName = this.$route.params.name;

      if (this.nodeName !== '') {
        await axios.post("/topology/node/" + this.nodeName + "/eqs/eq",
            {eq:{name:this.eqName}}).then(
            response => {
              // eslint-disable-next-line no-prototype-builtins
              if (!response.data.hasOwnProperty("errors")){
                console.log("请求成功", response.data);
                this.$message.success("获取设备信息成功");
                this.info = response.data;
              }

            },
            error => {
              console.log("失败！", error.message);
              this.$message.error(error.message);
            }
        )
      } else {
        this.$message.warning("请选择节点后再进行操作 ！")
      }
      this.showUI = true;
    },
  },
  mounted() {
    console.log(this.$route.params.name)
    this.info.eqs.eq.name = this.$route.params.name;

    this.$nextTick(function () {
      this.$bus.$on('slot-name', (data) => {
        this.info.eqs.eq.name = data;
      });
      this.$bus.$on('node-name', (data) => {
        this.nodeName = data;
      })
    })

  },

  created() {
    this.getEq();
    this.$nextTick(function () {
      this.$bus.$on('slot-name', (data) => {
        this.eqName = data;
        this.info.eqs.eq.name = data;
      });
      this.$bus.$on('node-name', (data) => {
        this.nodeName = data;
      })
    })
  }

}
</script>

<style scoped>

</style>